<!--
 * @Author: 杨光辉(GerhardYang)
 * @Date: 2021-06-07 10:46:19
 * @LastEditors: 杨光辉(GerhardYang)
 * @LastEditTime: 2021-09-16 17:53:40
 * @Description: file content
 * @Copyright: 超图软件华中平台客户中心 (SuperMap Software Co., Ltd. -Central China Platform)
-->
<template>
  <a-form layout="inline">
    <a-form-item>
      <a-select size="small" v-model="selectedField" style="width: 120px">
        <a-select-option
          v-for="(item, index) in searchField"
          :key="index"
          :value="item.title"
        >
          {{ item.title }}
        </a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item>
      <a-select size="small" style="width: 60px" v-model="selectedMode">
        <a-select-option
          v-for="(item, index) in searchMode"
          :key="index"
          :value="item"
        >
          {{ item }}
        </a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item>
      <a-input v-model="searchValue" size="small" placeholder="查询条件" />
    </a-form-item>
    <a-form-item>
      <a-button size="small" type="primary" @click="onSearch"
        >二次搜索</a-button
      >
    </a-form-item>
  </a-form>
</template>

<script>
export default {
  data() {
    return {
      selectedField: "",
      selectedMode: "=",
      searchMode: ["=", ">", ">=", "<", "<=", "LIKE"],
      searchValue: "",
    };
  },
  props: {
    searchField: {
      type: Array,
      default: () => {
        return [];
      },
    },
    sqlQuery: {
      type: Function,
      default: () => {
        return [];
      },
    },
  },
  watch: {
    searchField() {
      this.selectedField = this.searchField[0].title;
    },
  },
  methods: {
    onSearch() {
      const field = this.searchField.filter(
        (item) => item.title == this.selectedField
      )[0].dataIndex;
      if (this.selectedMode === "LIKE") {
        const sql = `${field} ${this.selectedMode} '%${this.searchValue}%'`;
        console.log(sql);
        this.sqlQuery(sql);
      } else {
        const sql = `${field} ${this.selectedMode} '${this.searchValue}'`;
        console.log(sql);
        this.sqlQuery(sql);
      }
    },
  },
};
</script>

<style></style>
